<template>
  <div>
    <el-form ref="addform" :model="addModel" :rules="rules" label-width="160px">
      <el-row>
        <el-col :span="16">
          <el-form-item label="标题:" prop="Title">
            <el-input v-model="addModel.Title"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="16">
          <el-form-item label="内容:" prop="Content">
            <el-input v-model="addModel.Content" type="textarea" :rows="3"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="图片:">
            <UploadImg @uploadCallback="uploadCallback" :fileList="fileList" :fileinfo="fileinfo"></UploadImg>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div class="text-center">
      <el-button type="primary" @click="submit('addform')">确定</el-button>
      <el-button type="danger" @click="backList">返回</el-button>
    </div>
  </div>
</template>
<script>
import UploadImg from "@/components/UploadImg.vue";

export default {
  components: { UploadImg },
  data() {
    return {
      addModel: {
        Title: "",
        Content: "",
        Fileinfo: ""
      },
      fileinfo: [],
      fileList: [],
      rules: {
        Title: [{ required: true, message: "请输入标题", trigger: "blur" }],
        Content: [{ required: true, message: "请输入内容", trigger: "blur" }]
      }
    };
  },
  created() {},
  methods: {
    backList() {
      this.$router.push({
        path: "/notice/index"
      });
    },

    submit(formName) {
      this.addModel.Fileinfo = JSON.stringify(this.fileinfo);
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.$api.post("/api/Notice/create", this.addModel).then(rsp => {
            if (rsp != false) {
              this.backList();
            }
          });
        }
      });
    },

    uploadCallback: function(fileinfo) {
      this.fileinfo = fileinfo;
    }
  }
};
</script>
